<template>
  <div>
    <div class="title">工作台/审核管理列表</div>

    <div class="box">
      <div class="box-title">
        <i class="el-icon-search"></i>
        <span>&nbsp; 筛选查询</span>
      </div>

      <el-form
        :inline="true"
        :model="form"
        class="demo-form-inline"
        size="mini"
      >
        <el-form-item class="form-style">
          <el-input v-model="form.user" placeholder="输入姓名查询"></el-input>
        </el-form-item>

        <el-form-item class="form-style">
          <el-date-picker
            type="date"
            placeholder="输入提交日期查询"
            v-model="form.date"
            style="width: 100%"
          ></el-date-picker>
        </el-form-item>

        <el-form-item class="form-style">
          <el-select v-model="form.region" placeholder="未通过">
            <el-option label="未审核" value="weishenhe"></el-option>
            <el-option label="已通过" value="yitongguo"></el-option>
            <el-option label="未通过" value="weitongguo"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onAdd">增加</el-button>
        </el-form-item>
      </el-form>

      <el-table :data="tableData" border class="tables" size="mini">
        <el-table-column prop="id" label="会员编号" width="179">
        </el-table-column>
        <el-table-column prop="name" label="姓名" width="170">
        </el-table-column>
        <el-table-column prop="phone" label="手机号" width="180">
        </el-table-column>
        <el-table-column prop="identityCard" label="身份证号" width="180">
        </el-table-column>
        <el-table-column prop="data" label="提交日期" width="170">
        </el-table-column>
        <el-table-column prop="state" label="状态" width="170">
        </el-table-column>
        <el-table-column prop="checkPerson" label="审核人" width="170">
        </el-table-column>
        <el-table-column prop="operation" label="操作" width="180">
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        date: "",
        type: [],
        user: "",
        region: "",
      },

      // 表格
      tableData: [
        {
          id: "123",
          name: "hahha",
          phone: "123456789",
          identityCard: "132456461",
          data: "2021",
          state: "aa",
          checkPerson: "sdfs",
          operation: "",
        },
        {
          id: "123",
          name: "hahha",
          phone: "123456789",
          identityCard: "132456461",
          data: "2021",
          state: "aa",
          checkPerson: "sdfs",
          operation: "",
        },
      ],
    };
  },
  methods: {
    onAdd() {
      console.log("add!");
    },
  },
};
</script>

<style scoped>
.title {
  text-align: left;
  padding-left: 220px;
  padding-top: 20px;
}
.box {
  width: 1400px;
  height: 170px;
  background: rgba(242, 242, 242, 1);
  margin: 20px;
  margin-left: 220px;
}
.box-title {
  float: left;
  margin: 20px 1000px 30px 150px;
  font-weight: 800;
}
.form-style {
  margin-right: 70px;
}

.tables {
  width: 1400px;
  margin-top: 80px;
}
</style>